html {  
    font-size: 16px; /* 1rem = 16px */  
}  

body {  
    margin: 0;  
    padding: 0;  
    font-family: Arial, sans-serif;  
}  

.container {  
    padding: 1rem; /* 16px */  
    display: flex;  
    flex-direction: column;  
    align-items: center;  
}  

.video-container, .canvas-container {  
    width: 18.75rem; /* 300px */  
    height: 18.75rem; /* 300px */  
    border: 1px solid #ccc;  
    border-radius: 50%;  
    margin-top: 1.875rem; /* 30px */  
    overflow: hidden;  
}  

video {  
    width: 100%;  
    height: 100%;  
    border-radius: 50%;  
}  

canvas {  
    width: 100%;  
    height: 100%;  
    border-radius: 50%;  
}  

button {  
    width: 19.5rem; /* 312px */  
    margin-top: 1rem;  
}